import { MenuType } from '@/types/menu';
import {
  getMenuTags,
  addMenuTags as addTag,
  removeMenuTags as removeTag,
} from '@/utils/auth';
import { defineStore } from 'pinia';

export const useMenuStore = defineStore('menu', {
  state: () => ({
    menu: [
      {
        id: '1',
        name: '首页',
        icon: 'mdi-home',
        path: '/manager',
        children: [
          {
            id: '1-1',
            name: '首页',
            path: '/manager/home',
            icon: 'mdi-home',
          },
          {
            id: '1-2',
            name: '看板',
            path: '/manager/dashboard',
            icon: 'mdi-view-dashboard',
          },
          {
            id: '1-3',
            name: '菜单管理',
            path: '/manager/menu',
            icon: 'mdi-menu',
          },
        ],
      },
      {
        id: '2',
        name: '首页',
        icon: 'mdi-view-dashboard',
        path: '/manager/home',
        children: [
          {
            id: '2-1',
            name: '角色管理',
            path: '/manager/role',
            icon: 'mdi-account-circle',
          },
          {
            id: '2-2',
            name: '456',
            path: '/list',
            icon: 'mdi-account-circle',
          },
        ],
      },
    ] as MenuType[],
    selected: ['1'],
    menuItem: ['1-1'],
    menuTags: getMenuTags(),
  }),
  getters: {
    curChildren: state => {
      return (
        state.menu.find(menu => menu.id == state.selected[0])?.children ??
        state.menu
      );
    },
  },
  actions: {
    setMenu(menu: MenuType[]) {
      this.menu = menu;
    },
    setSelected(id: string[]) {
      this.selected = id;
    },
    setMenuItem(id: string[]) {
      this.menuItem = id;
    },
    addMenuTag(tag: MenuType) {
      if (tag.id !== '1-1' && !this.menuTags.find(t => t.id === tag.id)) {
        this.menuTags.push(tag);
        addTag(tag);
      }
    },
    removeMenuTag(id: string) {
      const index = this.menuTags.filter(t => t.id != id);
      this.menuTags = index;
      removeTag(id);
    },
  },
});
